import QtQuick 2.6
import QtQuick.Layouts 1.2

import "../../Base/UiBase"
import "../../Base/Config"

import Data 1.0

Rectangle {
    id: root

    property string page: "evpost" // "evpost" or "tcpost" or "school" or "teacher"

    color: Color.background

    MouseArea {
        z: -1
        anchors.fill: parent
    }

    ColumnLayout {
        anchors.fill: parent
        spacing: 0

        // header
        Rectangle {
            Layout.fillWidth: true
            Layout.preferredHeight: 96 * Size.ratio
            color: Color.foreground

            // back button
            ImageButton {
                width: 80 * Size.ratio
                height: 96 * Size.ratio
                anchors.left: parent.left
                anchors.verticalCenter: parent.verticalCenter
                source: "../../../resources/comment/fanhiu01.svg"

                onClicked: root.visible = false
            } // end back button

            Text {
                anchors.centerIn: parent
                text: qsTr("我的收藏")
                color: Color.input
                font.pixelSize: Size.titleFont
            }
            BottomDivider {
            }
        } // end header

        // switcher
        Rectangle {
            Layout.fillWidth: true
            Layout.preferredHeight: 96 * Size.ratio
            color: Color.foreground
            RowLayout {
                anchors.fill: parent
                spacing: 0
                MouseArea {
                    property string name: "evpost"
                    property string text: qsTr("作品")
                    onClicked: root.page = name

                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    Text {
                        anchors.centerIn: parent
                        font.pixelSize: Size.font32
                        color: root.page === parent.name ? Color.main : Color.input
                        text: parent.text
                    }
                    Rectangle {
                        width: parent.width
                        height: 5 * Size.ratio
                        anchors.bottom: parent.bottom
                        color: Color.main
                        visible: root.page === parent.name
                    }
                }
                MouseArea {
                    property string name: "tcpost"
                    property string text: qsTr("帖子")
                    onClicked: root.page = name

                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    Text {
                        anchors.centerIn: parent
                        font.pixelSize: Size.font32
                        color: root.page === parent.name ? Color.main : Color.input
                        text: parent.text
                    }
                    Rectangle {
                        width: parent.width
                        height: 5 * Size.ratio
                        anchors.bottom: parent.bottom
                        color: Color.main
                        visible: root.page === parent.name
                    }
                }
                MouseArea {
                    property string name: "school"
                    property string text: qsTr("院校")
                    onClicked: root.page = name

                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    Text {
                        anchors.centerIn: parent
                        font.pixelSize: Size.font32
                        color: root.page === parent.name ? Color.main : Color.input
                        text: parent.text
                    }
                    Rectangle {
                        width: parent.width
                        height: 5 * Size.ratio
                        anchors.bottom: parent.bottom
                        color: Color.main
                        visible: root.page === parent.name
                    }
                }
                MouseArea {
                    property string name: "teacher"
                    property string text: qsTr("老师")
                    onClicked: root.page = name

                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    Text {
                        anchors.centerIn: parent
                        font.pixelSize: Size.font32
                        color: root.page === parent.name ? Color.main : Color.input
                        text: parent.text
                    }
                    Rectangle {
                        width: parent.width
                        height: 5 * Size.ratio
                        anchors.bottom: parent.bottom
                        color: Color.main
                        visible: root.page === parent.name
                    }
                }
            }
        }

        // end switcher
        Item {
            Layout.fillWidth: true
            Layout.preferredHeight: 20 * Size.ratio
        }

        // body
        Item {
            Layout.fillWidth: true
            Layout.fillHeight: true
            z: -1
            Loader {
                source: {
                    if(root.page === "evpost")
                        return "EVPost.qml"
                    else if(root.page === "tcpost")
                        return "TCPost.qml"
                    else if (root.page === "teacher")
                        return "Teacher.qml"
                    else
                        return "School.qml"
                }
                anchors.fill: parent
            }
        } // end body
    }
}
